<template>
  <div>
    <!-- <span class="back" @click="$router.go(-1)">&lt;</span> -->
    <van-nav-bar left-text="返回" left-arrow @click-left="$router.go(-1)" />
    <div class="box">{{ info.title }}</div>
    <van-tag plain type="danger" class="tip">{{ info.tags[0] }}</van-tag>

    <van-row type="flex" justify="space-around" class="flexStyle">
      <van-col span="6"
        >{{ info.price }}元/月
        <p>租金</p></van-col
      >
      <van-col span="6"
        >{{ info.desc.split('/')[0] }}
        <p>房型</p></van-col
      >
      <van-col span="6"
        >x平米
        <p>面积</p></van-col
      >
    </van-row>
    <van-row type="flex" justify="space-around" class="flexStyleDown">
      <van-col span="6"
        >装修:精装修
        <p>楼层:高楼层</p></van-col
      >

      <van-col span="6"
        >朝向:东
        <p>类型:普通</p></van-col
      >
    </van-row>
  </div>
</template>

<script>
export default {
  data() {
    return {
      info: null,
    }
  },
  created() {
    this.info = this.$route.query.item
    console.log(this.info)
  },
}
</script>

<style>
p,
.flexStyle,
.flexStyleDown {
  text-align: center;
}
.flexStyle {
  border-top: 1px solid #ccc;
  border-bottom: 1px solid #ccc;
  padding-top: 10px;
  padding-bottom: 10px;
  margin-top: 270px;
  color: red;
}
p {
  color: #999;
}
.flexStyleDown {
  margin-top: 20px;
  border-bottom: 1px solid #ccc;
}
.tip {
  position: absolute;
  top: 240px;
  left: 44px;
}
.back {
  font-size: 18px;
  color: #666;
  position: absolute;
  left: 15px;
  top: 15px;
  transform: scale(1, 1.5);
}
.box {
  position: absolute;
  top: 210px;
  left: 43px;
}
</style>
